import React, {Component} from 'react';
import {
    Button,
} from 'antd-mobile';

class PayFail extends Component {

    componentWillUnmount() {
        WeixinJSBridge.call('closeWindow');
    }

    closeWindow() {
        if (window.AlipayJSBridge) {
            window.AlipayJSBridge.call('exitApp');
        }
        if (WeixinJSBridge) {
            WeixinJSBridge.call('closeWindow')
        }
    }


    render() {
        const errorMsg = this.props.location.state ? this.props.location.state.errorMsg : '';
        console.log("errorMsg", errorMsg);
        return (<div style={{
                MozUserSelect: 'none',
                OUserSelect: 'none',
                KhtmlUserSelect: 'none',
                WebkitUserSelect: 'none',
                msUserSelect: 'none',
                userSelect: 'none',
                backgroundColor: '#fff',
                padding: '20px 0 20px 0'
            }}>

                <div style={{
                    display: 'flex',
                    alignItems: 'center',
                    justifyContent: 'center',
                }}
                >
                    <img src="/pages/mobile/car/scan/ku.png"/>
                </div>

                <div style={{
                    color: '#FF355D',
                    display: 'flex',
                    alignItems: 'center',
                    justifyContent: 'center',
                    fontSize: '20px',
                    marginTop: '10px',
                    fontWeight: 'bold'
                }}
                >
                    <div style={{
                        display: 'flex',
                        alignItems: 'center',
                        justifyContent: 'center',
                        marginTop: '10px',
                        fontWeight: 'bold'
                    }}>{errorMsg ? errorMsg : '支付失败了!'}</div>
                </div>

                <div ref="footer" style={{
                    width: '100%',
                    position: 'fixed',
                    bottom: 0
                }}>
                    <Button className="am-button-submit" onClick={() => this.closeWindow()}>关闭</Button>
                </div>

                <style>
                    {
                        `
                         .am-button-submit {
                            border-radius: 0px;
                        }
                        html:not([data-scale]) .am-button::before{
                            border: 0;
                        }
                        `
                    }
                </style>
            </div>
        );
    }
}

export default PayFail;